<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>思多客网络科技有限公司</title>
    <link href="http://cdn.bootcss.com/normalize/7.0.0/normalize.min.css" rel="stylesheet">
    <link href="http://cdn.bootcss.com/Swiper/3.4.2/css/swiper.min.css" rel="stylesheet">
    <link rel="stylesheet" href="public/lib/layer/css/layui.css">
    <link rel="stylesheet" href="public/css/public.css">
    <link rel="stylesheet" href="public/css/index.css">
</head>

<body>
    <div class="index-header">
        <div class="index-header-contain">
            <div class="nav-contact">
                <div class="row">
                    <ul class="address"></ul>
                    <div class="logo">
                        <a href="index.html">
                            <img src="public/images/sdk_logo.jpg" alt="">
                        </a>
                    </div>
                </div>
            </div>
            <div class="row nav-menu">
                <div class="inline-block menu"></div>
                <div class="inline-block tool-side">
                    <!-- <input class="search-bar hide" type="text"><span class="inline-block search-btn"></span> -->
                </div>
            </div>
            <div class="row roll-bar">
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination slider-pagination"></div>
                <div id="J_scrollingMessage" class="scrollingMessage">
                    <div style="width:1000vw">
                        <ul class="roll-ul" id="J_scrollingMessage_1"></ul>
                        <ul class="roll-ul" id="J_scrollingMessage_2"></ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="slider">
            <div class="swiper-container" id="J_swiper">
                <div class="swiper-wrapper"></div>
            </div>
        </div>
    </div>
    <div class="content-body">
        <div class="row top-content" id="J_content">
            <ul class="top-nav-ul" id="J_nav"></ul>
            <div class="row daily-contain">
                <div class="reward-content hide J_week_show" data-show="7">
                    <div class="reward-lists">
                        <ul id="J_reward_list"></ul>
                    </div>
                    <div class="common-problem">
                        <!--  <h3>常见问题</h3>
                        <ul class="problem-lists">
                            <li>如何发布悬赏？</li>
                            <li>悬赏的有效期是多少？</li>
                            <li>如果悬赏失败，那我的悬赏币会返还么？</li>
                        </ul> -->
                    </div>
                </div>
                <div class="master hide J_week_show" data-show="6">
                    <ul class="master-lists J_product_list"></ul>
                </div>
                <div class="master hide J_week_show" data-show="5">
                    <ul class="master-lists J_product_list"></ul>
                </div>
                <!-- <div class="master hide J_week_show" data-show="4">
                    <ul class="master-lists J_product_list"></ul>
                </div> -->
                <div class="lecturer hide J_week_show" data-show="4">
                    <div class="lecturer-contain">
                        <ul class="lecturer-lists J_product_list"></ul>
                    </div>
                    <div class="ranks hide">
                        <h3 class="ranks-title">龙虎榜</h3>
                        <ul class="rank-lists" id="J_rank_3"></ul>
                    </div>
                </div>
                <div class="lecturer hide J_week_show" data-show="3">
                    <div class="lecturer-contain">
                        <ul class="lecturer-lists J_product_list"></ul>
                    </div>
                    <div class="ranks hide">
                        <h3 class="ranks-title">龙虎榜</h3>
                        <ul class="rank-lists" id="J_rank_2"></ul>
                    </div>
                </div>
                <div class="lecturer hide J_week_show" data-show="2">
                    <div class="lecturer-contain">
                        <ul class="lecturer-lists J_product_list"></ul>
                    </div>
                    <div class="ranks hide">
                        <h3 class="ranks-title">龙虎榜</h3>
                        <ul class="rank-lists" id="J_rank_1"></ul>
                    </div>
                </div>
                <div class="lecturer hide J_week_show" data-show="1">
                    <div class="lecturer-contain">
                        <ul class="lecturer-lists J_product_list"></ul>
                    </div>
                    <div class="ranks hide">
                        <h3 class="ranks-title">龙虎榜</h3>
                        <ul class="rank-lists" id="J_rank_0"></ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 页脚 -->
    <div class="footer"></div>
    <script src="http://cdn.bootcss.com/Swiper/3.4.2/js/swiper.min.js"></script>
    <script src="public/lib/layer/layui.all.js"></script>
    <script src="public/js/G.js"></script>
    <script src="public/js/user.js"></script>
    <script src="public/js/product.js"></script>
    <script src="public/js/productOrder.js"></script>
    <script src="public/js/rechargeApi.js"></script>
    <script src="public/js/rechargeOrder.js"></script>
    <script src="public/js/reward.js"></script>
    <script src="public/js/rank.js"></script>
    <script src="public/js/rankOrder.js"></script>
    <script src="public/js/banner.js"></script>
    <script src="public/js/scrollingMessage.js"></script>
    <script src="public/js/public.js"></script>
    <script src="http://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
    <script id="T_nav" type="text/html">
        {{# d.forEach(function(item,index){ }}
        <li class="unselect J_week_btn" data-week="{{item.week}}">
            <div>
                <div class="week">{{item.title}}</div>
                <!-- <div class="title">{{item.body}}</div> -->
            </div>
        </li>
        {{# }); }}
    </script>
    <script id="T_product_a" type="text/html">
        {{# d.forEach(function(item,index){ }}
        <li>
            <div class="product-contain">
                <div class="inline-block lecturer-info">
                    <div class="lecturer-icon">
                        <img class="avator" src="{{G.defaultAvator}}" data-lazyload-img="{{G.uploadurl}}/avator/{{item.teacherId}}.png">
                    </div>
                </div>
                <div class="inline-block lecturer-datas">
                    <div class="lecturer-name"><span>{{formatVal(item.aliasName?item.aliasName:item.teacherName)}}</span><span class="lecturer-time">{{new Date(item.createTime).format('YYYY/MM/dd')}}</span></div>
                    <div>
                        <div class="inline-block">
                            <div class="lecturer-fans">粉丝数: <span class="counts">{{formatVal(item.sentiment)}}</span></div>
                            <div class="lecturer-downloads">下载量: <span class="counts">{{formatVal(item.downloadNumber)}}</span></div>
                        </div>
                        <div class="inline-block">
                            <div class="lecturer-price">现价<i class="lecturer-new-price">{{item.promotionsPrice}}</i></div>
                            {{# if(item.payed) { }}
                            <a class="lecturer-btn down-free" data-id="{{item.productId}}">下载</a> {{# } else if (item.free) { }}
                            <a class="lecturer-btn down-free" data-id="{{item.productId}}">免费下载</span></a> {{# } else { }}
                            <div class="lecturer-btn J_pay" data-id="{{item.productId}}">付费下载</div>
                            {{# } }}
                        </div>
                    </div>
                </div>
            </div>
            <div class="product-a-outline">{{item.nowContent}}</div>
        </li>
        {{# }); }}
    </script>
    <script id="T_product_b" type="text/html">
        {{# d.forEach(function(item,index){ }}
        <li>
            <div class="master-icon">
                <img class="b_coverUrl coverUrl" src="{{G.defaultCover}}" data-lazyload-img="{{G.uploadurl + item.coverUrl}}">
            </div>
            <div class="master-content">
                <div class="master-info">
                    <div class="m">
                        <!-- <div class="master-header">{{item.teacherType}}</div> -->
                        <div class="master-name">{{formatVal(item.aliasName?item.aliasName:item.teacherName)}}</div>
                        <div><span class="downloads">粉丝数<i class="download-count">{{formatVal(item.sentiment)}}</i></span></div>
                        <div><span class="downloads">下载量<i class="download-count">{{formatVal(item.downloadNumber)}}</i></span></div>
                    </div>
                    <div class="d">
                        <div class="downloads">原价:<span class="download-count line-through">{{formatVal(item.unitPrice)}}</span></div>
                        <div class="downloads">现价:<span class="download-count">{{formatVal(item.unitPrice)}}</span></div>
                        {{# if(item.payed) { }}
                        <a class="download-btn down-free" data-id="{{item.productId}}">下载</a> {{# } else if (item.free) { }}
                        <a class="download-btn down-free" data-id="{{item.productId}}">免费下载</span></a> {{# } else { }}
                        <div class="download-btn J_pay" data-id="{{item.productId}}">付费下载</div>
                        {{# } }}
                    </div>
                </div>
                <p class="product-outline">
                    本期提纲：
                    <br>{{formatOutline(formatVal(item.outline))}}
                </p>
            </div>
        </li>
        {{# }); }}
    </script>
    <script id="T_reward" type="text/html">
        {{# d.forEach(function(item,index){ }}
        <li>
            <div class="reward-head">
                <div class="inline-block rewarder-icon">
                    <img src="{{G.defaultAvator}}" data-lazyload-img="{{G.uploadurl}}/avator/{{item.userId}}.png" alt="" class="avator">
                </div>
                <div class="inline-block rewarder-name">{{item.createUser.username}}</div>
                <div class="inline-block color-gray size18">发布了悬赏·<span class="rewarder-time">{{new Date(item.createTime).format('YYYY-MM-DD HH:ii:ss')}}</span></div>
                <div class="inline-block color-gray size14"><span class="reward-ups">{{item.praiseNumber}}点赞数</span></div>
                <div class="inline-block color-gray size14"><span class="reward-reply">{{item.commentsNumber}}条评论</span></div>
            </div>
            <div class="reward-contain">
                <div class="inline-block reward-text">{{item.title}}</div>
                <div class="inline-block reward-btn" data-user="{{item.userId}}" data-id="{{item.rewardId}}">查看详情</div>
            </div>
            <div class="reward-after">
                <span class="reward-value">{{item.amountPay}}悬赏币</span>
            </div>
        </li>
        {{# }); }}
    </script>
    <script id="T_scrollingMessage" type="text/html">
        {{# d.forEach(function(item,index){ }}
        <li>{{new Date(item.createTime).format('YYYY-mm-dd')}} {{item.value}}</li>
        {{# }); }}
    </script>
    <script id="J_rank_tpl" type="text/html">
        <div class="stock-price">原价：<span class="old-price mr50">{{d.unitPrice}} </span>现价：<span class="new-price">{{d.promotionsPrice}}</span></div>
        <div class="rank-download J_pay_rank" data-newprice="{{d.promotionsPrice}}" data-oldprice="{{d.unitPrice}}" data-id="{{d.rankingId}}" data-pay="{{d.payed}}">付费查看</div>
        {{# for(var i = 1; i
        < 4; i ++){ }} <li class="rank-item rank-item{{i}}">
            <div class="rank-datas">
                <p>战绩：</p>
                <p class="ranks-score">{{formatVal(d['correct'+i])}}%</p>
            </div>
            <div class="rank-stock">
                <p class="stock-focus">共<span class="t-number">{{formatVal(d['teacherNumbers'+i])}}</span>位老师研究</p>
                {{# if(d.payed){ }}
                <p class="stock-name">{{formatVal(d['stockNumber'+i])}}
                    <br>{{formatVal(d['stockName'+i])}}</p>
                {{# } else{ }}
                <div class="cover">付费后显示</div>
                {{# }; }}
            </div>
            </li>
            {{# }; }}
    </script>
    <script id="J_swiper_tpl" type="text/html">
        {{# d.forEach(function(val,index){ }}
        <div class="swiper-slide">
            {{# if(val.url){ }}
            <a href="{{val.url}}" target="_blank"><img class="swiper-banner" src="{{G.uploadurl + val.originalUrl}}" alt=""></a>
            {{# }else{ }}
            <img class="swiper-banner" src="{{G.uploadurl + val.originalUrl}}" alt="">
            {{# } }}
        </div>
        {{# }); }}
    </script>
    <script>
    var top_nav_list = [{
        title: "周五",
        // body: "悬赏发布",
        body: "",
        week: 5
    }, {
        title: "周六",
        // body: "悬赏发布",
        body: "",
        week: 6
    }, {
        title: "周日",
        // body: "悬赏发布",
        body: "",
        week: 7
    }, {
        title: "周一",
        // body: "初级实战研究",
        body: "",
        week: 1
    }, {
        title: "周二",
        // body: "中级实战研究",
        body: "",
        week: 2
    }, {
        title: "周三",
        // body: "高级实战研究",
        body: "",
        week: 3
    }, {
        title: "周四",
        // body: "主题精研",
        body: "",
        week: 4
    }];

    var thisDay = new Date().getDay();
    // var now_week = Math.min(5, thisDay == 0 ? 7 : thisDay) - 1;
    var now_week = (thisDay == 0 ? 7 : thisDay) - 1;
    show(now_week);

    $(document).on("click", ".J_week_btn", function() {
        // var click_week = $(this).attr("data-week") - 1;
        var click_week = $(this).attr("data-week") - 1;
        show(click_week);
    })

    function show(now_week) {
        var show_list = [];
        // for (var i = 0, n = now_week; i < 5; i++, n = (n + 1) % 5) {
        //     show_list.push(top_nav_list[n]);
        // }
        for (var i = 0, n = now_week; i < 7; i++, n = (n + 1) % 7) {
            show_list.push(top_nav_list[n]);
        }
        laytpl($('#T_nav').html()).render(show_list, function(html) {
            $('#J_nav').html(html)
        })
        toShowWeek();
    }

    function getNowShowWeek(now_week) {
        //获取周几的数值 
        return +$("#J_nav li[data-week]:eq(3)").attr("data-week");
    }

    function toShowWeek() {
        var now_show_week = getNowShowWeek();
        $(".J_week_show").addClass("hide");
        $(".J_week_show[data-show='" + now_show_week + "']").removeClass("hide");
    }

    getA('A1', 1, 4);
    getA('A2', 2, 4);
    getA('A3', 3, 4);
    getA('A4', 4, 4);
    // getB('B1', 4);
    getB('B1', 5);
    getB('B2', 6);

    getReward();

    function getA(type, week, pageSize) {
        var params = {
            type: type,
            pageSize: pageSize,
            show: true
        };

        product.getList(params, function(data) {
            laytpl($('#T_product_a').html()).render(data.list, function(html) {
                $(".J_week_show[data-show='" + week + "'] .J_product_list").html(html)
            })
            lazyload()
        })
    }


    function getB(type, week) {
        var params = {
            type: type,
            pageSize: 4,
            show: true
        };

        product.getList(params, function(data) {
            if (!data.count) {
                return;
            }
            console.log(data)
            laytpl($('#T_product_b').html()).render(data.list, function(html) {
                // $(".J_week_show[data-show='" + week + "'] .J_product_list li[data-type='" + week + "']").html(html)
                $(".J_week_show[data-show='" + week + "'] .J_product_list").html(html)
            })
            lazyload()
        })
    }

    scrollingMessage.getList({}, function(data) {
        if (!data.count) {
            return;
        }
        laytpl($('#T_scrollingMessage').html()).render(data.list, function(html) {
            $("#J_scrollingMessage_1").html(html)
            $("#J_scrollingMessage_2").html(html)
        })
        runScrollingMessage()
    })

    function marquee() {
        var b = $("#J_scrollingMessage").get(0);
        var b1 = $("#J_scrollingMessage_1").get(0);
        var b2 = $("#J_scrollingMessage_1").get(0);
        if (b2.offsetWidth <= b.scrollLeft) {
            b.scrollLeft -= b1.offsetWidth;
        } else {
            b.scrollLeft++;
        }
    }

    var runScrollingMessageId = null;

    function runScrollingMessage() {
        runScrollingMessageId = setInterval(marquee, 50);
    }

    function getReward() {
        reward.getList({
            pageSize: 4
        }, function(data) {
            laytpl($('#T_reward').html()).render(data.list, function(html) {
                $("#J_reward_list").html(html);
            })
            lazyload()
        })
    }

    //龙虎榜
    // ['A1龙虎榜', 'A2龙虎榜', 'A3龙虎榜', 'A4龙虎榜'].forEach(function(val, index) {
    //     rank.findOne(val, {}, function(data) {
    //         console.log(data)
    //         laytpl($('#J_rank_tpl').html()).render(data, function(html) {
    //             $('#J_rank_' + index).html(html)
    //         })

    //     })
    // })


    $(document).on('click', '.J_pay', function() {
        var id = $(this).data('id');
        openPayLayer(id, '已取消支付')
    })


    //龙虎榜
    $(document).on('click', '.J_pay_rank', function() {
        var id = $(this).data('id');
        var oldPrice = $(this).data('oldprice');
        var newPrice = $(this).data('newprice');
        var payed = $(this).data('pay');
        if (payed) {
            return;
        }
        layer.load(1)
        user.getInfo({}, function(user) {
            var dom = rankPayTpl(user, id, oldPrice, newPrice)
            lazyload()
            layer.closeAll();
            layer.open({
                area: ['800px', '540px'],
                title: false,
                closeBtn: 1,
                type: 1,
                shadeClose: true,
                scrollbar: false,
                content: dom
            })
            form.render('radio', 'reward-radio')
            lazyload()
        })
    })

    function rankPayTpl(user, rankingId, oldPrice, newPrice) {
        var str = '<div class="reward-layer" id="rankingLayer">' +
            '<div class="teacherInfo-layer-head">赏金支付</div>' +
            '<div class="pay-layer-body" id="J_pay_body">' +
            '<div class="recharge-user-info">' +
            '<div class="user-info-contain inline-block">' +
            '<div class="user-info-item" id="J_reward_userInfo">' +
            '<div class="rewarder-icon fl"><img src="' + G.defaultAvator + '" data-lazyload-img="' + G.uploadurl + '/avator/' + user.userId + '.png" class="avator">' +
            '</div>' +
            '<div class="user-name fl">用户名: <span class="name">' + formatVal(user.username) + '</span></div>' +
            '<div class="user-money-remain fr">剩余金币: <span class="money">' + user.balance + '</span></div>' +
            '</div>' +
            '</div>' +
            '</div>' +
            '<div class="reward-info">' +
            '<div class="reward-product">' +
            '<div class="product-info rank-bg">' +
            '<div class="product-price">' +
            '<p class="rank-money">原价:<span class="old-price">' + oldPrice + '</span></p>' +
            '<p class="rank-money">现价:<span class="new-price">' + newPrice + '</span></p>' +
            '</div>' +
            '</div>' +
            '</div>' +
            '<div class="payType">' +
            '<h3>支付方式:</h3>' +
            '<div class="layui-form" lay-filter="reward-radio">' +
            '<div>' +
            '<input lay-filter="reward-radio" type="radio" name="payType" value="赏币支付" title="赏币支付" ' + ((user.balance - (newPrice ? newPrice : oldPrice) < 0) ? "disabled" : "checked") + '><span class="balance-not-enough ' + ((user.balance - (newPrice ? newPrice : oldPrice) < 0) ? "inline-block" : "hide") + '">余额不足,还需支付' + (((newPrice ? newPrice : oldPrice) - user.balance) + '').substring(0, 5) + '元,请选择下列方式支付</span>' +
            '</div>' +
            '<div>' +
            '<input lay-filter="reward-radio" type="radio" name="payType" value="网上支付" title="网上支付" ' + ((user.balance - (newPrice ? newPrice : oldPrice) > 0) ? "disabled" : "checked") + '>' +
            '</div>' +
            '</div>' +
            '<div class="clearfix">' +
            '<ul class="public-payment-list ' + ((user.balance - (newPrice ? newPrice : oldPrice) < 0) ? "show" : "hide") + '">' +
            '<li class="payment-item payment-alipay current-payment" data-type="alipay"></li>' +
            '<li class="payment-item payment-weixin" data-type="wx"></li>' +
            '<li class="payment-item payment-union" data-type="union"></li>' +
            '</ul>' +
            '<div class="fl"><img src="public/images/sdk_wx_pay.png" alt="" /></div>' +
            '<input type="hidden" id="J_oweMoney">' +
            '</div>' +
            '</div>' +
            '</div>' +
            '<div class="submit-reward" id="J_submit_reward">' +
            '<input type="button" id="rankPayBtn" class="submit-reward-btn" value="立即支付" data-id="' + rankingId + '" data-price="' + (newPrice ? newPrice : oldPrice) + '" data-balance="' + user.balance + '">' +
            '</div>' +
            '</div>' +
            '</div>'
        return str;
    }

    $(document).on('click', '#rankPayBtn', function() {
        var price = $(this).data('price');
        var rankingId = $(this).data('id');
        var balance = $(this).data('balance');
        var payType = $('.payment-item.current-payment').data('type');
        var radioVal = $('input[lay-filter="reward-radio"]:checked').val();
        var payMoney = balance - price;
        if (payMoney >= 0 && radioVal === '赏币支付') {
            onlinePayRank(rankingId, null, price)
        } else {
            onlinePayRank(rankingId, payType, payMoney)
        }
    })

    function onlinePayRank(rankingId, payType, payMoney) {
        console.log(rankingId, payType, payMoney)
        if (payType === 'alipay') {
            var newOpen = window.open();
        }
        rankOrder.add(rankingId, { balancePay: Math.abs(payMoney) }, function(data) {
            var rankingOrderId = data.rankingOrderId;
            rankOrder.findOne(rankingOrderId, {}, function(order) {
                if (order.payed) {
                    layer.msg('支付成功')
                    setTimeout(function() {
                        location.reload()
                    }, 1500)
                } else {
                    if (payType === 'wx') {
                        G.get("/pay/wx/rankingOrder/" + rankingOrderId + "/html", {}, function(data) {
                            payComfirm(rankingOrderId)
                            wxPayTpl()
                            $('#qrcode').qrcode(data.codeUrl);
                            layer.open({
                                area: ['300px', 'auto'],
                                title: false,
                                closeBtn: 1,
                                type: 1,
                                shadeClose: false,
                                scrollbar: false,
                                content: $('#J_wx_tpl')
                            })
                        })
                    } else {
                        newOpen.location = rankOrder.getUrl(rankingOrderId, payType);
                        payComfirm(rankingOrderId)
                    }
                }
            })
        })
    }

    function payComfirm(rankingOrderId) {
        layer.confirm('支付是否完成？', { title: false, closeBtn: false, btnAlign: 'c', btn: ['完成支付', '放弃支付'] }, function(index) {
            rankOrder.findOne(rankingOrderId, {}, function(order) {
                if (order.payed) {
                    layer.msg('支付成功')
                    setTimeout(function() {
                        location.reload()
                    }, 1500)
                } else {
                    layer.msg('支付失败')
                }
            }, function(e) {
                layer.msg('支付失败')
            })
        }, function() {
            layer.msg('放弃支付')
        });
    }

    //点击支付悬赏/查看悬赏按钮
    $(document).on('click', '.reward-btn', function() {
        var id = $(this).data('id');
        var userId = $(this).data('user')
        var localUserId = G.getCookie('sdk_user_id');
        var userType = G.getCookie('sdk_user_type');
        if (userType === 'USER' && userId != localUserId) {
            layer.msg('无法查看他人的悬赏')
            return;
        }
        G.setCookie('localUserId', localUserId)
        G.setCookie('rewardId', id)
        location.href = "reward-detail.html";
    })

    //产品移入移除
    $('.lecturer-contain').hover(function() {
        $(this).css('overflow', 'auto')
    }, function() {
        $(this).css('overflow', 'hidden')
    })
    var J_swiper;
    banner.getList({ type: 'pc' }, function(data) {
        console.log(data)
        laytpl($('#J_swiper_tpl').html()).render(data, function(html) {
            $("#J_swiper .swiper-wrapper").html(html);
        })
        J_swiper = new Swiper('#J_swiper', {
            autoplay: 6000,
            loop: true, //环路
            pagination: '.swiper-pagination', //分页元素
            autoplayDisableOnInteraction: false,
            paginationClickable: true, //此参数设置为true时，点击分页器的指示点分页器会控制Swiper切换。
            uniqueNavElements: false, //默认为true时，仅本swiper的container内的分页器有效，设置为false后，container以外的分页器也生效了。
            observer: true, //修改swiper自己或子元素时，自动初始化swiper
            observeParents: true //修改swiper的父元素时，自动初始化swiper
        })
    })

    //移入停止自动播放
    $(document).on('mouseover', '#J_swiper', function() {
        if (J_swiper) {
            J_swiper.stopAutoplay();
        }
    })
    $(document).on('mouseout', '#J_swiper', function() {
        if (J_swiper) {
            J_swiper.startAutoplay();
        }
    })
    </script>
</body>

</html>